<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<section class="wrapper">
    <div class="row">
        <div class="col-lg-12">
            <section class="panel">
                <header class="panel-heading">
                    微信用户管理
                    <button type="button" class="btn btn-info pull-right"
                            onclick="oceanModal.openDefault('wxUser/item')">新增微信用户
                    </button>
                </header>
                <div class="col-lg-12">
                    <%--<div class="search">--%>
                    <form id="adCompany_select_form">
                        <label style="color: #737B83;">手机号码:</label>
                        <input type="text" class="txt" id="phone" name="phone" placeholder="手机号码的关键数字"
                               style="margin-top: 10px;" required/>&nbsp;&nbsp;&nbsp;
                        <label style="color: #737B83;">角色:</label>
                        <select style="width: 100px; margin-top: 10px;" id="role" name="role">
                            <option value=""></option>
                            <option value="AD_COMPANY">广告公司</option>
                            <option value="SUPERVISION_DEPT">监管部门</option>
                            <option value="INSURANCE_COMPANY">保险公司</option>
                        </select>
                        <input type="button" id="search" class="btn" onclick="wxUserPage.select()" value="搜索"/>
                        <input type="reset" id="return" class="btn" onclick="load()" value="重置"/>
                    </form>
                    <%--</div>--%>
                </div>
                <div class="panel-body">
                    <table class="table table-striped table-bordered sortable">
                        <thead>
                        <tr>
                            <th>真实姓名</th>
                            <th>微信ID</th>
                            <th>手机号码</th>
                            <th>角色</th>
                            <th>所属组织</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody id="wxUser-list-body">

                        </tbody>
                    </table>
                    <div class="text-center">
                        <ul class="pagination">

                        </ul>
                    </div>
                </div>
            </section>
        </div>
    </div>
</section>

<script type="text/template" id="wxUser-list-template">
    <@ _.each(items, function (item) { @>
    <tr>
        <td><@= item.realName==null?"":item.realName @></td>
        <td><@= item.openId @></td>
        <td><@= item.phone @></td>
        <td>
            <@ if(item.role == "AD_COMPANY") { @>
            广告公司
            <@ } else if(item.role == "SUPERVISION_DEPT") { @>
            监管部门
            <@ } else if(item.role == "INSURANCE_COMPANY") { @>
            保险公司
            <@ } @>
        </td>
        <td><@= item.orgName @></td>
        <td>
            <button class="btn btn-primary btn-xs"
                    onclick="oceanModal.openDefault('wxUser/item?id=<@= item.id @>&role=<@= item.role @>')">
                <i class="icon-pencil"></i>
            </button>
            <button class="btn btn-danger btn-xs"
                    onclick="wxUserPage.drop('<@= item.id @>')">
                <i class="icon-trash "></i>
            </button>
        </td>
    </tr>
    <@ }); @>
</script>
<script type="text/template" id="wxUser-page-template">
    <@ for(var index=1;index<=totalPages;index++) { @>
    <@ if(number==index-1) {@>
    <li class="active"><a href="javascript:void(0)" data-index="<@=index @>"><@=index @></a></li>
    <@ } else { @>
    <li><a href="javascript:void(0)" data-index="<@=index @>"><@=index @></a></li>
    <@ }} @>
</script>
<script type="application/javascript">
    function load(page) {
        if (page == null) {
            page = 1;
        }
        WaitingDialog.show();
        $.post("resources/wxUser/list", {page: page}, function (data) {
            console.log(data);
            WaitingDialog.dismiss();
            if (data == null) {
                return;
            }
            var tmpl = _.template($('#wxUser-list-template').html());
            $('#wxUser-list-body').html(tmpl({items: data.content}));

            var tmpl_page = _.template($('#wxUser-page-template').html());
            $('.pagination').html(tmpl_page({totalPages: data.totalPages, number: data.number}));

            $('.pagination a').click(function () {
                load($(this).data("index"));
            });
        });
    }
    load();

    var wxUserPage = {
        drop: function (id) {
            if (confirm("确定要删除吗？")) {
                var url = "resources/entity";
                var obj = "com.ocean.billboard.entity.WxUser";
                WaitingDialog.show();
                request.deleteEntity(url, obj, id,
                    function (data) {
                        WaitingDialog.dismiss();
                        toast.success('删除成功');
                        load();
                    }, function (data) {
                        WaitingDialog.dismiss();
                        toast.error('删除失败：' + JSON.stringify(data));
                    });
            }
        },
        select: function (page) {
            if (page == null) {
                page = 1;
            }
            var phone, role;
            phone = $('#phone').val();
            role = $('#role').val();
            WaitingDialog.show();
            $.post("resources/wxUser/select", {phone: phone, role: role, page: page}, function (data) {
                console.log(data);
                WaitingDialog.dismiss();
                if (data == null) {
                    return;
                }
                var tmpl = _.template($('#wxUser-list-template').html());
                $('#wxUser-list-body').html(tmpl({items: data.content}));

                var tmpl_page = _.template($('#wxUser-page-template').html());
                $('.pagination').html(tmpl_page({totalPages: data.totalPages, number: data.number}));

                $('.pagination a').click(function () {
                    wxUserPage.select($(this).data("index"));
                });
            });
        }
    }
</script>
